import { FormRule, Image, PrimaryTableCol, Space, TableRowData } from 'tdesign-vue-next';

import { ActionBarItem } from '@/components/common-action-bar/index.vue';
import { SearchBarItem } from '@/components/common-search-bar/index.vue';
import { t } from '@/locales';
import { tableActionBtn, tableSwitch } from '@/utils/action';

export interface FormItem {
  id?: number;
  title: string;
  description?: string;
  type: number;
}

export const SEARCH_BAR_DATA: SearchBarItem[] = [
  { name: 'id', component: 'input', label: 'ID', value: '', labelWidth: 50 },
  { name: 'title', component: 'input', label: 'common.title', value: '', labelWidth: 50 },
  {
    name: 'type',
    component: 'radio-button',
    label: 'common.type',
    value: 999,
    labelWidth: 50,
    width: 300,
    options: [
      { label: 'common.all', value: 999 },
      { label: 'pages.patch.richText', value: 0 },
      { label: 'pages.patch.listData', value: 1 },
    ],
  },
];

export const ACTION_BAR_DATA: ActionBarItem[] = [
  { text: 'common.add', theme: 'primary', auth: ['content:patch:create'], key: 'addShow' },
  {
    text: 'common.delete',
    theme: 'danger',
    auth: ['content:patch:batDelete'],
    disabled: true,
    key: 'listBatDel',
    message: t('pages.patch.deleteConfirm'),
  },
  {
    text: 'common.disabled',
    theme: 'default',
    disabled: true,
    auth: ['content:patch:batDisplay'],
    key: 'listBatDisable',
    message: t('pages.patch.disableConfirm'),
  },
  {
    text: 'common.enable',
    theme: 'default',
    disabled: true,
    auth: ['content:patch:batDisplay'],
    key: 'listBatEnable',
    message: t('pages.patch.enableConfirm'),
  },
];

export const COLUMNS: PrimaryTableCol<TableRowData>[] = [
  { colKey: 'row-select', type: 'multiple', width: 46 },
  { colKey: 'id', title: 'ID', width: 100 },
  { colKey: 'title', title: () => t('common.title') },
  { colKey: 'description', title: () => t('common.description'), ellipsisTitle: true },
  {
    colKey: 'type',
    title: () => t('common.type'),
    cell(h, { row: { type } }) {
      return [t('pages.patch.richText'), t('pages.patch.listData')][type];
    },
  },
  { colKey: 'manager.username', title: () => t('common.updateBy') },
  { colKey: 'updatedAt', title: () => t('common.createAt') },
  {
    title: () => t('common.status'),
    colKey: 'display',
    width: 150,
    cell(h, { row }) {
      const ele = tableSwitch(h, row, ['content:patch:display']);
      return row.display !== undefined ? ele : '';
    },
  },
  {
    colKey: 'action',
    title: () => t('common.operation'),
    width: 260,
    cell(h, { row }) {
      const actionEdit = tableActionBtn({ h, type: 'edit', row, auths: ['content:patch:detail'] });
      const actionDelete = tableActionBtn({ h, type: 'delete', row, auths: ['content:patch:delete'] });
      const actionContent = tableActionBtn({
        h,
        type: 'content',
        row,
        auths: [['content:patch:textUpdate'], ['content:patch:listQuery']][row.type],
      });
      return h(Space, () => {
        return [actionEdit, actionDelete, actionContent];
      });
    },
  },
];

export const FORM_DATA: FormItem = {
  id: 0,
  title: '',
  description: '',
  type: 0,
};

export const FORM_RULES: Record<string, FormRule[]> = {
  title: [{ required: true, trigger: 'change' }],
};

export const COLUMNS_PATCH_LIST: PrimaryTableCol<TableRowData>[] = [
  { title: 'ID', colKey: 'id', width: 80 },
  { title: () => t('common.sort'), colKey: 'listorder', width: 100 },
  {
    title: t('pages.patch.img'),
    colKey: 'imgUrl',
    width: 115,
    cell(h, { row: { imgUrl } }) {
      return h(Image, {
        src: imgUrl,
        fit: 'contain',
        style: {
          width: '80px',
          height: '80px',
        },
      });
    },
  },
  { title: t('pages.patch.name'), colKey: 'title', width: 200, ellipsisTitle: true },
  { title: () => t('common.description'), colKey: 'description', ellipsisTitle: true },
  { title: t('pages.patch.link'), colKey: 'url', ellipsisTitle: true },
  { title: () => t('common.operation'), colKey: 'action', width: 120 },
];

export interface PatchListFormItem {
  id: number;
  title: string;
  description?: string;
  url: string;
  img: Recordable;
}

export const FORM_PATCH_LIST_DATA: PatchListFormItem = {
  id: 0,
  title: '',
  description: '',
  url: '',
  img: {},
};

export const FORM_PATCH_LIST_RULES: Record<string, FormRule[]> = {
  title: [{ required: true, trigger: 'change' }],
  url: [
    {
      pattern: /^(http:\/\/|https:\/\/)([a-zA-Z0-9_.]+)\.([a-zA-Z\\.]+)$/,
      message: t('common.formatError'),
      trigger: 'change',
    },
  ],
};
